import Vue from 'vue'
import VueRouter from 'vue-router'
import Login from '../components/Login/login.vue' //引入login组件
import Home from '../components/Home.vue' //引入Home组件
import Welcome from '../components/Welcome.vue'
import UserList from '../components/admin/UserList.vue'
import Record from '../Record/Record.vue'

Vue.use(VueRouter)

const routes = [{
    path: '/',
    redirect: '/Login'
},
{
    path: '/Login',
    component: Login
},
{
    path: '/Home',
    component: Home,
    children: [{
        path: "/Welcome",
        component: Welcome
    },
    {
        path: "/user",
        component: UserList
    },
    {
        path: "/record",
        component: Record
    },
    {
        path: '',
        redirect: '/Welcome'
    }]
},

]

const router = new VueRouter({
    routes
})


// 挂载路由导航守卫（路由导航守卫是为了路由跳转之前做的检查及操作）
//     比如：用户没有登录 而是直接通过修改浏览器 url 来访问网页，这种操作无疑是不安全的。
//     路由导航守卫可以让我们对用户要跳转的路由做一次检查，符合条件后放行，不符合条件则强制用户跳转登录页面。
router.beforeEach((to, from, next) => {
    //to 将要访问
    //from 从哪访问
    //next 接着干  next(url)  重定向到url上next()继续访问to路径
    if (to.path == '/login') return next(); //如果首页则不拦截
    //获取user
    const userFlag = window.sessionStorage.getItem("user"); //取出当前用户
    if (!userFlag) return next('/login'); //无值，返回登录页
    next(); //符合要求  放行
})

export default router